<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <script type="text/javascript" src="js/jquery-3.2.1.min.js"></script>
    <script type="text/javascript" src="js/sha256.min.js"></script>
    <script type="text/javascript" src="js/common.js"></script>
    <script type="text/javascript" src="js/userPage.js"></script>
    <link rel="stylesheet" type="text/css" href="css/userPage.css">
    <link rel="stylesheet" type="text/css" href="css/login.css">
    <link rel="shortcut icon" href="favicon.ico"/>
    <title>Z5C Online User Page</title>
    <script type="text/javascript">
        function pictureInput() {
	        document.getElementById("storepic").click();
	    }
    </script>
</head>
<body>
	<div id="bdy">
		<div id="divTitle">
		    <div id="divIco" onclick="goHome()"></div>
		    <label id="title">Z5C Online User Page</label>
		</div>
		<hr id="goldHr">
	    <div id="divMain">
		    <div id="divUserMain">
		        <div id="divUserHeader">
					<form id="newPicData" action="headPic.user" method="post" enctype="multipart/form-data">
			            <input type="file" id="storepic" name="storepic" accept="image/png, image/jpeg" class="hid">
					</form>
			        <div id="headPic" onclick="pictureInput()"></div>
		        </div>
		        <div id="divUserDetail">
		            <div id="divDetails">
		                <div id="divUinfo">
		                    <input type="text" id="unick" value="My Nickname">
		                    <div id="divUnameUid">
		                        <label id="uname">my username</label>
		                        <label id="uid">uid:1023456</label>
		                    </div>
							<input type="password" id="upass" class="hid" value="" placeholder="********">
				            <div id="btnChangePassword">Change Password</div>
		                </div>
		                
		                <div id="divScoreRank" class="flexColumnCenter">
		                    <label id="uscore">38460</label>
		                    <label id="urank" class="hid">Rank: 327/4096</label>
							<div id="btnJoinRank">Join Rank !</div>
		                </div>
		                <div id="divWinLostRun">
		                    <label id="ulost">Lost: 276</label>
		                    <label id="uwin">Win: 328</label>
		                    <label id="urun">Run: 2</label>
		                </div>
		            </div>
		            <div id="btnLogout" class="btn">LOGOUT</div>
		        </div>
		    </div>
		</div>
	</div>
</body>
</html>